<template>
  <div class="my-list">
    <Paglist
      v-model="dataList"
      :is-init-api="true"
      :parame="{ type: BehaviorCollectTypeEnum.BO }"
      @register="register"
      :scroll-top-bottom="260"
      :is-show-loadmore="dataList.length >= 10"
    >
      <template v-for="v in dataList" :key="v.id">
        <view class="list-item">
          <BusinessOpportunitiesItem
            v-bind="v"
            :is-collect="true"
            @detail="handleDetail(v)"
          ></BusinessOpportunitiesItem>
        </view>
      </template>
    </Paglist>
  </div>
</template>
<script setup lang="ts">
  import Paglist from '@/components/Paglist/index.vue';
  import { useConList } from '@/components/Paglist/useConList';
  import { ref, provide } from 'vue';
  import BusinessOpportunitiesItem from './BusinessOpportunitiesItem.vue';
  import { navigateTo } from '@/router';
  import { behaviorCollectList } from '@/api';
  import { BehaviorCollectTypeEnum } from '@/enums/publicModuleEnum';
  import type { IBusinessOpportunityList } from '@/api/businessOpportunities/type';

  provide('api', behaviorCollectList);
  const dataList = ref<IBusinessOpportunityList[]>([]);

  const [register, { refresh }] = useConList();
  const handleDetail = (v: IBusinessOpportunityList) => {
    navigateTo({
      name: 'supplyDemandDetails',
      options: {
        id: v.id,
        successFn: () => {
          refresh();
        },
      },
    });
  };
  defineExpose({
    refresh,
  });
</script>
<style lang="scss" scoped>
  .list-item {
    padding: 0 30rpx;
    margin-bottom: 30rpx;
    &:nth-child(1) {
      padding-top: 30rpx;
    }
  }
</style>
